@charset "utf-8";

///*轮播图*/
.lunbo{
    width: 1280px;
    height: 545px;
    margin: 0 auto;
    box-shadow: 5px 5px 5px gainsboro;
}
.ce{
    width: 1280px;
    height: 545px;
    margin: 0 auto;
    overflow: hidden;
}
.ce .the-one{
    width: 256px;
    height: 545px;
    float: left;
    transform-origin: top;
    transform-style: preserve-3d;
    position: relative;
    animation:haha 4s  linear forwards 1.5s;
    .one{
        transform-origin: bottom;
        position: absolute;
//      transform: translateZ(272.5px);
        
    }
    .two{
        transform-origin: top;
        position: absolute;
        transform: rotateX(-90deg)  translateZ(545px);
    }
}
.ce .the-two{
    width: 256px;
    height: 545px;
    float: left;
    transform-origin: bottom;
    transform-style: preserve-3d;
    position: relative;
    animation:haha 4s  linear forwards 1.5s;
    .one{
        transform-origin: top;
        position: absolute;
//      transform: translateZ(272.5px);
    }
    .two{
        transform-origin: bottom;
        position: absolute;
        transform: rotateX(-90deg)  translateZ(-545px);
    }
}
.ce .the-three{
    width: 256px;
    height: 545px;
    float: left;
    transform-origin: top;
    transform-style: preserve-3d;
    position: relative;
    animation:haha 4s linear forwards 1.5s;
    .one{
        transform-origin: bottom;
        position: absolute;
//      transform: translateZ(272.5px);
        
    }
    .two{
        transform-origin: top;
        position: absolute;
        transform: rotateX(-90deg)  translateZ(545px);
    }
}
.ce .the-four{
    width: 256px;
    height: 545px;
    float: left;
    transform-origin: bottom;
    transform-style: preserve-3d;
    position: relative;
    animation:haha 4s  linear forwards 1.5s;
    .one{
        transform-origin: top;
        position: absolute;
//      transform: translateZ(272.5px);
        
    }
    .two{
        transform-origin: bottom;
        position: absolute;
        transform: rotateX(-90deg)  translateZ(-545px);
    }
}
.ce .the-five{
    width: 256px;
    height: 545px;
    float: left;
    transform-origin: top;
    transform-style: preserve-3d;
    position: relative;
    animation:haha 4s  linear forwards  1.5s;
    .one{
        transform-origin: bottom;
        position: absolute;
//      transform: translateZ(272.5px);
        
    }
    .two{
        transform-origin: top;
        position: absolute;
        transform: rotateX(-90deg)  translateZ(545px);
    }
}
.ce .the-one div{
    
}
@-webkit-keyframes haha{
    0%{
        
    }
    50%{
        transform: rotatex(90deg);  
    }
    100%{
        transform: rotatex(0deg);
    }  
}
#big-zhong{
    width: 1280px;
    height: 628px;
    margin: 0 auto;
    background: #f6f6f6;
     padding-top: 72px;
#zhong{
    height: 474px;
    width: 977px;
    margin: 0 auto;
    position: relative;
   
    .te-zhong{
    width: 315px;
    height: 474px;
    overflow: hidden;
    position: relative;
    position: absolute;
    left: 0;
    background: white;
    .te-one{
       width: 315px;
       height: 237px;
       background: #2395cb;
       text-align: center;
       position: relative;
       position: absolute;
       top: 0;
       transition: all 0.8s;
       z-index: 1;
       img{
           margin-top: 50px;
       }
       p{
           margin-top: 12.5px;
           font-size: 17px;
           color: white;
       }
       h6{
           margin-top: 11px;
           font-size:15px ;
           font-weight: 400;
           color: white;
       }
       span{
           position: absolute;
           left: 50%;
           margin-left: -49px;
           display: block;
           width: 99px;
           border-bottom:1px solid white ;
       }
    }
    .te-one1{
       width: 315px;
       height: 237px;
       position: relative;
       position: absolute;
       top:237px;
       transition: all 0.8s;
       z-index: 2;
       .jiao{
           display: block;
           height: 0;
           width: 0;
           border: 21px solid transparent;
           border-top-color: #2395cb;
           overflow: hidden; 
           position: absolute; 
           left: 50%;
           margin-left:-21px; 
        }
       .tuwen{
           width: 286px;
           height: 200px;
           padding-top:27px;
           margin: 0 auto;
           border-bottom:2px dashed gainsboro;
           transition: all 0.8s;
           h2{
               width: 282px;
               font-size: 13px;
               float: left;
               margin-bottom:13px ;
           }
           img{
               float: left;
               margin-right: 26px;
               
           }
           p{
               font-size: 14px;
               width: 128px;
               float: left;
               line-height: 23px;
               margin-top: 4px;
           }
           span{
               float: left;
               font-size: 14px;
               margin-top: 9px;
           }
       }
       .ul-one{
           width: 315px;
           height: 126px;
           margin-top: 50px;
           margin-left: 16px;
           transition: all 0.5s;
           li{
               font-size: 14px;
               margin-bottom:5px;
           }
       }
    }
    &:hover{
        >.te-one{
            top:-35px;
            height: 210px;
        }
        >.te-one1{
            top: 175px;
            >.tuwen{
                height: 160px;
            }
            >.ul-one{
                margin-top: 24px;
            }
        }
    }
}
    .te-zhong1{
        width: 315px;
        height: 474px;
        overflow: hidden;
        position: relative;
        position: absolute;
        left: 331px;
        background: white;
        .te-one-1{
            width: 315px;
            height: 237px;
            background: #3ed1a4;
            text-align: center;
            position: relative;
            position: absolute;
            top: 0;
            transition: all 0.8s;
            z-index: 1;
       img{
           margin-top: 50px;
       }
       p{
           margin-top: 12.5px;
           font-size: 17px;
           color: white;
       }
       h6{
           margin-top: 11px;
           font-size:15px ;
           font-weight: 400;
           color: white;
       }
       span{
           position: absolute;
           left: 50%;
           margin-left: -49px;
           display: block;
           width: 99px;
           border-bottom:1px solid white ;
            }
        }
        .te-one-2{
            width: 315px;
            height: 237px;
            position: absolute;
            position: relative;
            top:237px;
            transition: all 0.8s;
            z-index: 2;
            .jiao{
                display: block;
                height: 0;
                width: 0;
                border: 21px solid transparent;
                border-top-color: #3ed1a4;
                overflow: hidden; 
                position: absolute; 
                left: 50%;
                margin-left:-21px;
            }
            .tuwen2{
                width: 286px;
                height: 200px;
                padding-top:27px;
                margin: 0 auto;
                transition: all 0.8s;
                img{
                    margin-top: 25px;
                    transition: all 0.8s;
                }
                h3{
                    color: #2395cb;
                    text-align: center;
                    font-size: 14px;
                    margin-top: 26px;
                    transition: all 1s;
                }
                p{
                    font-size: 14px;
                    margin-top: 12px; 
                    text-align: center;
                }
            }
        }
        &:hover{
            >.te-one-1{
            top:-35px;
            height: 210px;
                }
            >.te-one-2{
                top: 175px;
                >.tuwen2{
                height: 160px;
                >img{
                    margin-top: 0px;
                }
                >h3{
                   margin-top: 18px; 
                }
                }
            }
        }    
    } 
    .te-zhong2{
        width: 315px;
        height: 474px;
        overflow: hidden;
        position: absolute;
        position: relative;
        left: 662px;
        background: white;
    .te-one-3{
            width: 315px;
            height: 237px;
            background: #895ea3;
            text-align: center;
            position: relative;
            position: absolute;
            top: 0;
            transition: all 0.8s;
            z-index: 1;
       img{
           margin-top: 50px;
       }
       p{
           margin-top: 12.5px;
           font-size: 17px;
           color: white;
       }
       h6{
           margin-top: 11px;
           font-size:15px ;
           font-weight: 400;
           color: white;
       }
       span{
           position: absolute;
           left: 50%;
           margin-left: -49px;
           display: block;
           width: 99px;
           border-bottom:1px solid white ;
            }
        }
    .te-one-4{
            width: 315px;
            height: 237px;
            position: absolute;
            position: relative;
            top:237px;
            transition: all 0.8s;
            z-index: 2;
            .jiao{
                display: block;
                height: 0;
                width: 0;
                border: 21px solid transparent;
                border-top-color: #895ea3;
                overflow: hidden; 
                position: absolute; 
                left: 50%;
                margin-left:-21px;
            }
            img{
                display: inline-block;
                width: 289px;
                margin-top: 30px;
                position: absolute;
                top: 30px;
                left: 13px;
                transition: all 0.8s;
            }
            .p123{
                width: 285px;
                height: 70px;
                
                position: absolute;
                left: 15px;
                top: 300px;
                background: url(../img/yinhao.png) no-repeat;
                transition: all 0.8s;
            
            p{
                position: absolute;
                font-size: 14px;
                width: 207px;
                height: 36px;
                line-height: 24px;
                margin-left: 42px;
                margin-top: 10px;
            }
        }
    }
     &:hover{
            >.te-one-3{
            top:-35px;
            height: 210px;
            }
            >.te-one-4{
                top: 175px;
                >img{
                margin-top: 10px;
                }
                >.p123{
                   top: 200px; 
                }
               
            }
        }  
}
      
}

.biao-zhong{
    width: 257px;
    height: 54px;
    text-align: center;
    margin:0 auto;
    position: relative;
    margin-top:58px;
    h1{
        font-size: 18px;
    }
    h4{
        width: 100px;
        text-align: center;
        background: #f6f6f6;
        display: inline-block;
        font-size: 12px;
        color: #b0b0b0;
        position: absolute;
        left:78px ;
        top: 35px;
    }
    span{
        display: block;
        width: 257px;
        margin-top:18px ;
        border: 1px solid #b0b0b0;
    }
}
}

.di-te{
    width: 1280px;
    height: 343px;
    background: url(../img/dibu.png) no-repeat;
    margin: 0 auto;
    .di-p{
        text-align: center;
        width: 895px;
        height: 66px;
        padding-top: 50px;
        margin: 0 auto;
        p{
          font-size: 14px;
          line-height: 22px; 
        }
    }
//  img{
//      display: block;
//      margin: 0 auto;
//      margin-top:38px ;
//  }
    
    .dibu-lun{
        width: 1048px;
        height: 167px;
        margin: 0 auto;
        position: relative;
        overflow: hidden;
        .beijing{
            position: absolute;
            z-index: 1;
        }
        .the-one-lun{
            display: block;
            width: 282px;
            height: 159px;
            position: absolute;
            top: 4px;
            left: -423px;
            z-index: 2;
            animation: one-lun 10s infinite ;
            transition: all 10s;
        }
        .the-two-lun{
            display: block;
            width: 282px;
            height: 159px;
            position: absolute;
            top: 4px;
            left: -139px;
            z-index: 2;
            animation: two-lun 10s infinite ;
            transition: all 10s;
        }
        .the-three-lun{
            display: block;
            width: 282px;
            height: 159px;
            position: absolute;
            top: 4px;
            left: 143px;
            z-index: 2;
            animation: three-lun 10s infinite ;
            transition: all 10s;
        }
        .the-four-lun{
            display: block;
            width: 282px;
            height: 159px;
            position: absolute;
            top: 4px;
            left: 425px;
            z-index: 2;
            animation: four-lun 10s infinite ;
            transition: all 10s;
        }
        .the-five-lun{
            display: block;
            width: 282px;
            height: 159px;
            position: absolute;
            top: 4px;
            left: 707px;
            z-index: 2;
            animation: five-lun 10s infinite ;
            transition: all 10s;
        }
        .the-six-lun{
            display: block;
            width: 282px;
            height: 159px;
            position: absolute;
            top: 4px;
            left: 989px;
            z-index: 2;
            animation: six-lun 10s infinite ;
            transition: all 10s;
        }
        .the-seven-lun{
            display: block;
            width: 282px;
            height: 159px;
            position: absolute;
            top: 4px;
            left: 1271px;
            z-index: 2;
            animation: seven-lun 10s infinite ;
            transition: all 10s;
        }
        .the-eight-lun{
            display: block;
            width: 282px;
            height: 159px;
            position: absolute;
            top: 4px;
            left: -423px;
            z-index: 2;
            animation: eight-lun 10s infinite ;
            transition: all 10s;
        }
        
        
    }
    
    
}
.di-biao{
    width: 1280px;
    height: 54px;
    text-align: center;
    margin:0 auto;
    position: relative;
    padding-top:32px;
    padding-bottom:20px ;
    background: #f6f6f6;
    h1{
        font-size: 18px;
    }
    h4{
        width: 100px;
        text-align: center;
        background: #f6f6f6;
        display: block;
        font-size: 12px;
        color: #b0b0b0;
        position: absolute;
        left:46%;
        top: 65px;
    }
    span{
        display: block;
        width: 257px;
        padding-top:18px ;
        border-bottom: 2px solid #b0b0b0;
        margin: 0 auto;
    }
}
#dibu{
    width: 1075px;
    height: 425px;
    margin: 0 auto;
    margin-top:52px ;
    margin-bottom:60px ;
    position: relative;
    .di-one{
        width: 434px;
        height: 425px;
        float: left;
        .img{
            display: block;
            float: left;
            position: relative;
            img{
                &:nth-child(2){
                position: absolute;
                top: 7px;
                left: 7px;
                transition: all 0.6s;
            }
            }
            &:hover img:nth-child(2){
                transform: scale(1.2);
            }
            
        }
        ul{
            float: left;
            margin-left: 26px;
            margin-bottom:24px ;
            li{
                font-size: 14px;
                color: #8f8f8f;
                margin-bottom: 15px;
                img{
                    margin-right:14px ;
                }
            &:first-child{
                    img{
                       padding-top:2px ; 
                    } 
                }
            &:nth-child(3){
                img{
                       padding-top:4px ; 
                    } 
            }
            }
            
        }
        #weizhi{
            position: absolute;
            top: 230px;
            width: 430px;
            height: 196px;
        }
        .floor-list-box{
            display: none;
        }
    }
    .tijiao{
        float: left;
        width: 605px;
        height: 425px;
        margin-left:36px ;
        span{
            float: left;
            color: #8f8f8f;
        }
        input{
            float: left;
            width: 604px;
            height: 32px;
            border:0.5px dashed #8f8f8f;
            background:#f9f8f8;
            margin-top: 7px;
            margin-bottom: 17px;
        }
        textarea{
            float: left;
            border:0.5px dashed #8f8f8f;
            width: 604px;
            height: 120px;
            background: #f9f8f8;
            resize:none;
            margin-top: 7px;
        }
        .button{
            width: 94px;
            height: 30px;
            margin-top:12px ;
            background: #3c9cd3;
            color: white;
            transition: all 0.5s;
            &:hover{
            transform: scale(1.1);
            }
            &:active{
               background: pink; 
            }
        }
        
        
    }
}
@-webkit-keyframes one-lun{
    0%{
        left: -423px;
        
        opacity: 1;
    }
    15%{
        left: -141px;
        
        opacity: 1;
    }
    30%{
        left: 141px;
        
        opacity: 1;
    }
    45%{
        left: 423px;
        
        opacity: 1;
    }
    60%{
        left: 705px;
        
        opacity: 1;
    }
    75%{
        left: 987px;
        opacity: 1;
    }
    90%{
        left: 1269px;
        opacity: 0;
    }
//  70%{
//      left: 987px;
//      opacity: 0;
//  }
//  80%{
//      left: 705px;
//      opacity: 0;
//  }
//  90%{
//      left: 423px;
//      opacity: 0;
//  }
    100%{
        left: -423px;
        opacity: 0;
    }
    
}
@-webkit-keyframes two-lun{
    0%{
        left: -139px;
        
        opacity: 1;
    }
    15%{
        left: 143px;
        
        opacity: 1;
    }
    30%{
        left: 425px;
        
        opacity: 1;
    }
    45%{
        left: 707px;
        
        opacity: 1;
    }
    60%{
        left: 989px;
        
        opacity: 1;
    }
    75%{
        left: 1271px;
        opacity: 0;
    }
//  90%{
//      left: 1269px;
//      opacity: 0;
//  }
//  70%{
//      left: 987px;
//      opacity: 0;
//  }
//  80%{
//      left: 705px;
//      opacity: 0;
//  }
    90%{
        left: -423px;
        opacity: 0;
    }
    100%{
        left: -139px;
        opacity: 1;
    }
    
}
@-webkit-keyframes three-lun{
    0%{
        left: 143px;
        
        opacity: 1;
    }
    15%{
        left: 425px;
        
        opacity: 1;
    }
    30%{
        left: 707px;
        
        opacity: 1;
    }
    45%{
        left: 989px;
        
        opacity: 1;
    }
    60%{
        left: 1271px;
        
        opacity: 0;
    }
//  75%{
//      left: 1271px;
//      opacity: 0;
//  }
//  90%{
//      left: 1269px;
//      opacity: 0;
//  }
//  70%{
//      left: 987px;
//      opacity: 0;
//  }
    75%{
        left: -423px;
        opacity: 0;
    }
    90%{
        left:-139px;
        opacity: 1;
    }
    100%{
        left: 143px;
        opacity: 1;
    }
    
}
@-webkit-keyframes four-lun{
    0%{
        left: 425px;
        opacity: 1;
    }
    15%{
        left: 707px;
        
        opacity: 1;
    }
    30%{
        left: 989px;
        
        opacity: 1;
    }
    45%{
        left: 1271px;
        
        opacity: 0;
    }
//  60%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
//  75%{
//      left: 1271px;
//      opacity: 0;
//  }
//  90%{
//      left: 1269px;
//      opacity: 0;
//  }
    60%{
        left:-423px;
        opacity: 0;
    }
    75%{
        left: -139px;
        opacity: 1;
    }
    90%{
        left:143px;
        opacity: 1;
    }
    100%{
        left: 425px;
        opacity: 1;
    }
    
}
@-webkit-keyframes five-lun{
    0%{
        left: 707px;
        opacity: 1;
    }
    15%{
        left: 989px;
        
        opacity: 1;
    }
    30%{
        left: 1271px;
        
        opacity: 0;
    }
//  45%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
//  60%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
//  75%{
//      left: 1271px;
//      opacity: 0;
//  }
    45%{
        left:-423px;
        opacity: 0;
    }
    60%{
        left:-139px;
        opacity:1;
    }
    75%{
        left: 143px;
        opacity: 1;
    }
    90%{
        left:425px;
        opacity: 1;
    }
    100%{
        left: 707px;
        opacity: 1;
    }
    
}
@-webkit-keyframes six-lun{
    0%{
        left: 989px;
        opacity: 1;
    }
    15%{
        left: 1271px;
        
        opacity: 0;
    }
//  30%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
//  45%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
//  60%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
    30%{
        left: -423px;
        opacity: 0;
    }
    45%{
        left:-139px;
        opacity: 1;
    }
    60%{
        left:143px;
        opacity: 1;
    }
    75%{
        left: 425px;
        opacity: 1;
    }
    90%{
        left:707px;
        opacity: 1;
    }
    100%{
        left: 989px;
        opacity: 1;
    }
    
}
@-webkit-keyframes seven-lun{
    0%{
        left: 1271px;
        opacity: 0;
    }
//  15%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
//  30%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
//  45%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
    15%{
        left:-423px;
        
        opacity: 0;
    }
    30%{
        left: -139px;
        opacity: 1;
    }
    45%{
        left:143px;
        opacity: 1;
    }
    60%{
        left:425px;
        opacity: 1;
    }
    75%{
        left: 707px;
        opacity: 1;
    }
    90%{
        left:989px;
        opacity: 1;
    }
    100%{
        left:1271 px;
        opacity: 0;
    }
    
}
@-webkit-keyframes eight-lun{
//  0%{
//      left: -423px;
//      opacity: 0;
//  }
//  15%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
//  30%{
//      left: 1271px;
//      
//      opacity: 0;
//  }
    0%{
        left: -423px;
        
        opacity: 0;
    }
    15%{
        left:-139px;
        
        opacity: 1;
    }
    30%{
        left: 143px;
        opacity: 1;
    }
    45%{
        left:425px;
        opacity: 1;
    }
    60%{
        left:707px;
        opacity: 1;
    }
    75%{
        left: 989px;
        opacity: 1;
    }
    90%{
        left:1271px;
        opacity: 0;
    }
    100%{
        left:-423px;
        opacity: 0;
    }
    
}


//#footer{
//  width: 1280px;
//  height: 137px;
//  margin: 0 auto;
//  .footer-one{
//      width: 1280px;
//      height: 102px;
//      text-align: center;
//      background: #3c9cd3;
//      p{
//          color: white;
//          font-size: 12px;
//          .iconfont{
//              font-size:20px ;
//              color: #48b9fa;
//              padding-right:26px ;
//          }
//          .icon-weibo1{
//              padding-left: 16px;
//          }
//          &:first-child{
//              padding-top:20px ;
//          }
//          &:nth-child(2){
//              padding-top:18px ;
//          }
//      }
//      a{
//          list-style: none;
//          color: white;
//          font-size: 12px;
//          padding:0 3px ;
//      }
//  }
//  .footer-two{
//      width: 1280px;
//      height: 35px;
//      background: black;
//      text-align: center;
//      p{
//          color: white;
//          font-size: 12px;
//          padding-top: 10px;
//      }
//  }
//  
//}
